<template>
  <view class="container" >
    <z-paging ref="paging" v-model="newList" @query="queryList">
      <template #top>
        <z-nav-bar id="nav" bgColor="#ffffff" title="洗衣小常识"></z-nav-bar>
      </template>

      <view class="rail-container mgt-20" v-for="(item,index) in newList" :key="index" @click="goTo(item)">
        <image class="coverImage" :src="item.coverImage"></image>
        <view class="right_box" >
          <view>{{ item.title }}</view>
          <view>发布日期：{{ item.createTime }}</view>

        </view>
      </view>
    </z-paging>

  </view>
</template>

<script setup>
import {knowledgeList} from '@/api/pagesShop/index'

import {onMounted,ref} from "vue";
import { onReachBottom,onLoad } from '@dcloudio/uni-app';
import {commonStore} from "@/stores/common.js"
const CommonStore = commonStore()
let pageTitle = ref('资讯列表')

const newList = ref([]);
const paging = ref(null)
const queryList = (pageNo, pageSize) => {
  // 此处请求仅为演示，请替换为自己项目中的请求
  knowledgeList({
    pageNum:pageNo,
    pageSize:pageSize
  }).then(res=>{
    console.log('res1111111111',res)
    paging.value.complete(res)
  })
}
//------------------------------------onload------------

onLoad((e)=>{

})
onMounted(() => {
  console.log("======onMounted====")
  // informationList()
});

//-----------------------------------function------------

function goTo(item){
  CommonStore.setRichText({
    title: item.title,
    content: item.content
  })
  uni.navigateTo({
    url:'/pagesInfo/web/commonAgreement'
  })

}

</script>

<style lang="scss">
.container{
  padding-bottom: 200rpx;
}
.text-ellipsis {

  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1; /* 显示的行数 */
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100%; /* 文本最大宽度 */
  width:75%
}
.rail-container{
  width: 100%;
  padding:  32rpx;
  display: flex;
  .coverImage{
    width: 160rpx;
    height: 160rpx;
    border-radius: 10rpx;
  }
  .right_box{
    box-sizing: border-box;
    flex: 1;
    margin-left: 24rpx;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 24rpx 0;
  }
}
</style>
